<template>
    <div>
        <h1>添加</h1>
        <table class="table">
            <tbody>
                <tr>
                    <td>会员名称</td>
                    <td>
                        <input type="text" v-model="data.Name">
                    </td>
                </tr>

                <tr>
                    <td>会员密码</td>
                    <td>
                        <input type="password" v-model="data.Password">
                    </td>
                </tr>

                <tr>
                    <td>性别</td>
                    <td>
                        <input type="radio" v-model="data.Sex" :value="true" name="sex" >男
                        <input type="radio" v-model="data.Sex" :value="false" name="sex" >女
                    </td>
                </tr>
                
                <tr>
                    <td>爱好</td>
                    <td>
                        <span v-for="d in Houbby">
                            <input type="checkbox" v-model="Houbbys" :value="d">{{ d }}
                        </span>
                    </td>
                </tr>

                <tr>
                    <td>上传图片</td>
                    <td>
                        <input type="file" @change="files">
                        <img :src="'https://localhost:7165/'+data.img" style="width: 100px;height: 100px;">
                    </td>
                </tr>

                <tr>
                    <td>会员等级</td>
                    <td>
                        <select v-model="data.MemberLevelId">
                            <option value="0">请选择</option>
                            <option v-for="d in find" :value="d.Id">{{ d.Name }}</option>
                        </select>
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="添加" @click="Add">
                    </td>
                </tr>

            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue';
import axios from 'axios';
import { useInfoStore } from '@/stores/info';
import { useRouter } from 'vue-router';

//pinia
var infos=useInfoStore();

//下拉框
const find=ref([{
      "Id": 0,
    "Name": ""
}])

//添加
const data=ref({
    "Id": 0,
  "Name": "",
  "Password": "",
  "HoubbyCount": 0,
  "HoubbyString": "",
  "IsDelete": true,
  "Sex": true,
  "img": "",
  "MemberLevelId": 0,
  "CreateData": "2025-04-10T11:31:10.905Z"
})


//钩子
onMounted(() => {
    glq();
    xlk();
})

//跳转
var touer=useRouter();

//判断是否登录
const glq=()=>{
    if(infos.find.name==""){
        alert("还没有登录");
        touer.push({path:"/DL"});
    }
}

//定义集合
const Houbby=ref(["篮球","羽毛球","足球","游泳","登山"])
const Houbbys=ref([]);


//下拉框
const xlk=()=>{
    axios.get("https://localhost:7165/api/Mem/GetLevelList").then(res=>{
        find.value=res.data;
    })
}

//上传图片
const files=(e:any)=>{
    var f=e.target.files[0];
    var fd=new FormData();
    fd.append("file",f);
    if(f.size>1024*1024*1){
        alert("最大图片不能超过1MB");
        return;
    }
    if(f.type!="image/png" && f.type!="image/jpeg" ){
        alert("图片只能是 PNG 和 JPG 格式");
        return;
    }
    axios.post("https://localhost:7165/api/Files/Filesd",fd).then(res=>{
        data.value.img=res.data;
    })
}


//添加
const Add=()=>{
    data.value.HoubbyString=Houbbys.value.toString();
    data.value.HoubbyCount=Houbbys.value.length;

    axios.post("https://localhost:7165/api/Mem/MemAdd",data.value).then(res=>{
        if(res.data>0){
            alert("添加成功");
            touer.push({path:"/"})
        }else{
            alert("添加失败");
            return;
        }
    })
}



</script>

<style scoped>

</style>